import Vue from 'vue'
import VueRouter from 'vue-router'

import Login from '@/views/login/Login.vue';
import Layout from '@/views/layout/Layout';

const routerPush = VueRouter.prototype.push;
VueRouter.prototype.push = function (location) {
  return routerPush.call(this, location).catch(err => { })
};

Vue.use(VueRouter)

const routes = [

  {
    path: '/',
    redirect: "/Login"
  },

  // 登录
  {
    path: '/Login',
    component: Login
  },

  // 首页
  {
    path: '/home',
    component: Layout,
    redirect: '/home',
    meta: { title: '首页' },
    icon:'icon-home',
    children: [
      {
        path: '/home',
        component: () => import('@/views/home/Home.vue'),
      },
    ]

  },
  // 个人中心
  {
    path: '/my',
    component: Layout,
    meta: { title: '个人中心' },
    redirect: '/my',
    children: [
      {
        path: '/my',
        component: () => import('@/views/my/my.vue'),
      },
    ]
  },


  {
    path: '*',
    component: () => import('@/views/notfount/notfount.vue'),
  }
]

const asyncRoutes = [
  // 订单管理
  {
    path: '/order',
    component: Layout,
    meta: { title: '订单管理', role: ['super', 'normal'] },
    redirect: '/order',
    icon:'icon-order',
    children: [
      {
        path: '/order',
        component: () => import('@/views/order/Order.vue'),
        meta: { title: '订单管理', role: ['super', 'normal'] },
      },
    ]
  },

  // 商品管理
  {
    path: '/goods',
    component: Layout,
    meta: { title: '商品管理', role: ['super', 'normal'] },
    redirect: '/goods/GoodsList',
    icon:'icon-goods',
    children: [
      {
        path: '/goods/GoodsList',
        meta: { title: '商品列表', role: ['super', 'normal'] },
        component: () => import('@/views/goods/GoodsList.vue'),
      },
      {
        path: '/goods/AddGoods',
        meta: { title: '添加商品', role: ['super'] },
        component: () => import('@/views/goods/AddGoods.vue'),
      },
      {
        path: '/goods/AddCate',
        meta: { title: '商品分类', role: ['super'] },
        component: () => import('@/views/goods/AddCate.vue'),
      },
    ]
  },

  // 店铺管理
  {
    path: '/shop',
    component: Layout,
    redirect: '/shop',
    meta: { title: '店铺管理', role: ['super'] },
    icon:'icon-shop',
    children: [
      {
        path: '/shop',
        component: () => import('@/views/shop/Shop.vue'),
        meta: { title: '店铺管理', role: ['super'] },
      },
    ]
  },

  // 账号管理
  {
    path: '/account',
    component: Layout,
    meta: { title: '账号管理', role: ['super', 'normal'] },
    redirect: '/account/AccList',
    icon:'icon-account',
    children: [
      {
        path: '/account/AccList',
        meta: { title: '账号列表', role: ['super', 'normal'] },
        component: () => import('@/views/account/AccList.vue'),
      },
      {
        path: '/account/AccAdd',
        meta: { title: '添加账号', role: ['super'] },
        component: () => import('@/views/account/AccAdd.vue'),
      },
      {
        path: '/account/AccModify',
        meta: { title: '修改密码', role: ['super'] },
        component: () => import('@/views/account/AccModify.vue'),
      },
    ]
  },

  // 销售管理
  {
    path: '/total',
    component: Layout,
    meta: { title: '销售管理', role: ['super'] },
    redirect: '/total/GoodsTotal',
    icon:'icon-total',

    children: [
      {
        path: '/total/GoodsTotal',
        meta: { title: '商品统计', role: ['super'] },
        component: () => import('@/views/total/GoodsTotal.vue'),
      },
      {
        path: '/total/OrderTotal',
        meta: { title: '订单统计', role: ['super'] },
        component: () => import('@/views/total/OrderTotal.vue'),
      },
    ]
  },

]

const router = new VueRouter({
  routes
})

// 路由守卫
router.beforeEach((to,from,next)=>{
  let tk=localStorage.getItem("tk");
  if(to.path=="/login"){
    next()
  }

  if(tk){
    next()
  }else{
    next({path:"/login"})
  }
  
})

// 动态路由
export function calcRoutes() {

  // 拿到当前本地存储的role
  let roles = localStorage.getItem("role");
  // 如果本地存储里面没有rloe就不会执行
  if (!roles) {
    return
  };
  // 遍历动态路由
  let r = asyncRoutes.filter(v => {
    //console.log(v);
    // 判断asyncRoutes这个动态路由中的一级路由中的role中是否存在这个你的super或normal并且返回你本地存储的那个role可以访问页面的动态路由
    if (v.meta && v.meta.role && v.meta.role.includes(roles)) {
      return v
    }
  })


  // 将你本地存储的那个role可以访问页面的动态的一级路由中再次遍历找到它里面的二级路由 并且返回你本地存储里面的role可以访问的二级动态页面
  r.filter(v => {
    if (v.children && v.children.length) {
      v.children = v.children.filter(vv => {
        return vv.meta && vv.meta.role && vv.meta.role.includes(roles)
      })
    }
  })

  // 将有权限访问的页面用filter进行遍历 router.addRoute(v)添加到router里面
  r.filter(v => {
    router.addRoute(v)
  })

  // 本地存储
  localStorage.setItem("routers", JSON.stringify([
    {
      path: '/home',
      component: Layout,
      redirect: '/home',
      meta: { title: '首页' },
      icon:'icon-home',
    }, ...r
  ]))
}
calcRoutes()

export default router
